
<!doctype html>
<html>
<head>

   <!-- player skin -->
   <link rel="stylesheet" type="text/css" href="../dist/skin/skin.css?f" />

   <!-- site specific styling -->
   <style>
   body {
      font: 12px "Myriad Pro", "Lucida Grande", sans-serif;
      text-align: center;
      padding-top: 1%;
   }
   .flowplayer { width: 70%; }
   </style>
   <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
   <!-- include flowplayer -->
   <script src="../dist/flowplayer.js?i"></script>
   </head>

<body>

   <!-- the player -->
   <div id="player">
    </div>

    <script>
    var el = document.getElementById('player');
    var api = flowplayer(el, {
        ratio: 9/16,
        live: true,
        dvr: true,
        nativesubtitles: true,
        clip: {
          sources: [
            {
              type: "application/x-mpegurl",
              src: "https://stream.novascotiawebcams.com/live-origin/whitepointbeach/playlist.m3u8?DVR"
            }
          ]
        }
      });
    api.on('load', function(ev, player, video) {
    });
    </script>


</body>

